<!DOCTYPE html><!--全部商品列表-->
<html lang="en" class="x-admin-sm" xmlns:th="http://www.thymeleaf.org">
<head th:replace="common/amazingHeader2::amazing_header('商品列表')">
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div class="layui-fluid">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
            <div class="layui-card">
                <div class="layui-card-body ">
                    <form class="layui-form layui-col-space5">
                        <button type="button" class="layui-btn layui-btn-danger" onclick="delAll()"><i
                                class="layui-icon"></i>批量删除
                        </button>
                        <div class="layui-inline layui-show-xs-block">
                            <input type="text" name="orderNo" placeholder="请输入订单号"
                                   class="layui-input" id="orderNo">
                        </div>
                        <div class="layui-inline layui-show-xs-block">
                            <button class="layui-btn" type="button"><i
                                    class="layui-icon" onclick="orderSearch()">&#xe615;</i></button>
                        </div>
                        <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right"
                           onclick="location.reload()" title="刷新">
                            <i class="layui-icon layui-icon-refresh" style="line-height:30px"></i>
                        </a>
                    </form>
                    <hr>
                    <blockquote class="layui-elem-quote">
                        商品类别：<span id="cname"></span>
                    </blockquote>
                </div>
                <div class="layui-card-body layui-table-body layui-table-main">
                    <table class="layui-table layui-form">
                        <thead>
                        <tr>
                            <th>
                                <input type="checkbox" lay-filter="checkall" name="" lay-skin="primary">
                            </th>
                            <th>ID</th>
                            <th>订单号</th>
                            <th>用户名</th>
                            <th>支付方式</th>
                            <th>支付状态</th>
                            <th>创建时间</th>
                            <th>更新时间</th>
                            <th>操作</th>
                        </tr>
                        </thead>
                        <tbody id="orderBody">

                        </tbody>
                    </table>
                </div>
                <div class="layui-card-body " style="text-align: center">
                    <div class="page">
                        <div id="page">

                        </div>
                    </div>
                    <div style="margin-top: 5px">
                        共有<span id="total"></span>条数据，每页显示
                        <label for="pageSize">
                            <select id="pageSize" class="layui-select" onchange="page(1)">
                                <option selected="selected">5</option>
                                <option>6</option>
                                <option>7</option>
                            </select>
                        </label>
                        条
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script>
    function page(nowPage) {
        $.ajax({
            type: 'GET',
            url: 'order/selPayInfoByOrderNo',
            data: {
                'num': nowPage,
                'orderNo': $('#orderNo').val(),
                'size': $('#pageSize').val()
            },
            beforeSend: function () {
                loading = layer.msg('处理中', {icon: 16});
            },
            success: function (result) {
                layer.close(loading);
                const data = result.data;
                $('#total').text(data.total);
                const arr = data.list;
                const orderBody = $('#orderBody');
                orderBody.empty();
                for (let i = 0; i < arr.length; i++) {
                    const tr = $('<tr></tr>');
                    tr.append("<td><input type='checkbox' name='id' value='" + arr[i].id + "' lay-skin='primary'></td>");
                    tr.append("<td>" + arr[i].id + "</td>");
                    tr.append("<td>" + arr[i].orderNo + "</td>");
                    $.ajax({
                        type: 'GET',
                        url: 'user/detail',
                        async: false,
                        data: {
                            'id': arr[i].userId
                        }, success: function (result1) {
                            tr.append("<td>" + result1.data.username + "</td>");
                        }
                    });
                    if (arr[i].payPlatform === null) {
                        tr.append("<td>未支付</td>");
                    } else if (arr[i].payPlatform === 1) {
                        tr.append("<td>支付宝</td>");
                    } else {
                        tr.append("<td>微信</td>");
                    }
                    if (arr[i].platformStatus === 0) {
                        tr.append("<td>已取消</td>");
                    } else if (arr[i].platformStatus === 1) {
                        tr.append("<td>待支付</td>");
                    } else {
                        tr.append("<td>已支付</td>");
                    }
                    tr.append("<td>" + arr[i].createTime + "</td>");
                    tr.append("<td>" + arr[i].updateTime + "</td>");
                    tr.append("<td class='td-manage'><a title=\"删除\" onclick=\"member_del(this," + arr[i].id + ")\" href=\"javascript:;\"><i class=\"layui-icon\">&#xe640;</i></a></td>");
                    orderBody.append(tr);
                }
                const page = $('#page');
                const allPage = result.data.navigateLastPage;//总页数
                page.empty();
                if (nowPage <= 1) {//如果减后 nowPage值不合法 将链接设为红色 且去掉点击事件
                    page.append("<a class='prev' style='color: red'>&lt;&lt;</a>");
                } else {
                    page.append("<a class='prev' onclick=page(" + (nowPage - 1) + ")>&lt;&lt;</a>");
                }
                for (let i = 1; i <= allPage; i++) {
                    if (i === nowPage) {
                        page.append(" <span class='current'>" + i + "</span>");
                    } else {
                        page.append("<a class='num' onclick='page(" + i + ")'>" + i + "</a>");
                    }
                }
                if (nowPage === allPage) {//如果nowPage已经等于最大值  将连接设为红色 且去掉点击事件
                    page.append("<a style='color: red' class='prev' id='a' >&gt;&gt;</a>");
                } else {
                    page.append("<a class='prev' id='a' onclick=page(" + (nowPage + 1) + ")>&gt;&gt;</a>");
                }
                form = layui.form;
                form.render();
            }
        })
    }

    page(1);

    /*
   模糊查找商品
    */
    function orderSearch() {
        page(1);
    }
</script>
<script>
    layui.use(['laydate', 'form'],
        function () {
            var laydate = layui.laydate;
            var form = layui.form;
            // 监听全选
            form.on('checkbox(checkall)', function (data) {

                if (data.elem.checked) {
                    $('tbody input').prop('checked', true);
                } else {
                    $('tbody input').prop('checked', false);
                }
                form.render('checkbox');
            });
            //执行一个laydate实例
            laydate.render({
                elem: '#start' //指定元素
            });

            //执行一个laydate实例
            laydate.render({
                elem: '#end' //指定元素
            });
        });

    /*用户-删除*/
    function member_del(obj, id) {
        const arr = [];
        arr.push(id);
        layer.confirm('确认要删除吗？',
            function (index) {
                //发异步删除数据
                del(arr);
                $(obj).parents("tr").remove();
                layer.msg('已删除!', {
                    icon: 1,
                    time: 1000
                });
            });
    }

    function del(arr) {
        $.ajax({
            type: 'DELETE',
            url: '/order/delPayInfo',
            async:false,
            data: JSON.stringify(arr),
            contentType: 'application/json',
            dataType: "json",
            success: function () {
                layer.msg('删除成功', {time: 1000, icon: 6, shift: 6})
            }
        });
        page(1);
    }

    /*删除选中的所有数据*/
    function delAll(argument) {
        const ids = [];

        // 获取选中的id
        $('tbody input').each(function (index, el) {
            if ($(this).prop('checked')) {
                ids.push($(this).val())
            }
        });

        layer.confirm('确认要删除吗？' + ids.toString(), function (index) {
            //捉到所有被选中的，发异步进行删除
            del(ids);
            member_del(null, ids);
            layer.msg('删除成功', {icon: 1});
            page(1);
        });
    }
</script>
</body>
</html>